Regex Tools |
grep |
PowerGREP |
RegexBuddy |
RegexMagic |
General Applications |
EditPad Lite |
EditPad Pro |
Databases |
MySQL |
Oracle |
PostgreSQL |
JavaScript’s regular expression flavor is part of the ECMA-262 standard for the language. This means your regular expressions should work exactly the same in all implementations of JavaScript. In the past there were many serious browser-specific issues. But modern browsers do a very good job of following the JavaScript standard for regular expressions. You only need to make sure your web pages have a doctype that requests the browser to use standards mode rather than quirks mode.
In JavaScript source code, a regular expression is written in the form of /pattern/modifiers where “pattern” is the regular expression itself, and “modifiers” are a series of characters indicating various options. The “modifiers” part is optional. This syntax is borrowed from Perl. JavaScript supports the following modifiers, a subset of those supported by Perl:
You can combine multiple modifiers by stringing them together as in /regex/gim. Notably absent is an option to make the dot match line break characters.
Since forward slashes delimit the regular expression, any forward slashes that appear in the regex need to be escaped. E.g. the regex 1/2 is written as /1\/2/ in JavaScript.
To match absolutely any character without /s, you can use character class that contains a shorthand class and its negated version, such as [\s\S].
JavaScript implements Perl-style regular expressions. However, it lacks quite a number of advanced features available in Perl and other modern regular expression flavors:
Many of these features are available in the XRegExp library for JavaScript.
To test if a particular regex matches (part of) a string, you can call the strings’s match() method: if (myString.match(/regex/)) { /*Success!*/ }. If you want to verify user input, you should use anchors to make sure that you are testing against the entire string. To test if the user entered a number, use: myString.match(/^\d+$/). /\d+/ matches any string containing one or more digits, but /^\d+$/ matches only strings consisting entirely of digits.
To do a search and replace with regexes, use the string’s replace() method: myString.replace(/replaceme/g, "replacement"). Using the /g modifier makes sure that all occurrences of “replaceme” are replaced. The second parameter is an normal string with the replacement text.
Using a string’s split() method allows you to split the string into an array of strings using a regular expression to determine the positions at which the string is splitted. E.g. myArray = myString.split(/,/) splits a comma-delimited list into an array. The comma’s themselves are not included in the resulting array of strings.
The easiest way to create a new RegExp object is to simply use the special regex syntax: myregexp = /regex/. If you have the regular expression in a string (e.g. because it was typed in by the user), you can use the RegExp constructor: myregexp = new RegExp(regexstring). Modifiers can be specified as a second parameter: myregexp = new RegExp(regexstring, "gim").
I recommend that you do not use the RegExp constructor with a literal string, because in literal strings, backslashes must be escaped. The regular expression \w+ can be created as re = /\w+/ or as re = new RegExp("\\w+"). The latter is definitely harder to read. The regular expression \\ matches a single backslash. In JavaScript, this becomes re = /\\/ or re = new RegExp("\\\\").
Whichever way you create “myregexp”, you can pass it to the String methods explained above instead of a literal regular expression: myString.replace(myregexp, "replacement").
If you want to retrieve the part of the string that was matched, call the exec() function of the RegExp object that you created, e.g.: mymatch = myregexp.exec("subject"). This function returns an array. The zeroth item in the array will hold the text that was matched by the regular expression. The following items contain the text matched by the capturing parentheses in the regexp, if any. mymatch.length indicates the length of the match[] array, which is one more than the number of capturing groups in your regular expression. mymatch.index indicates the character position in the subject string at which the regular expression matched. mymatch.input keeps a copy of the subject string.
Calling the exec() function also changes the lastIndex property of the RegExp object. It stores the index in the subject string at which the next match attempt will begin. You can modify this value to change the starting position of the next call to exec().
The test() function of the RegExp object is a shortcut to exec() != null. It takes the subject string as a paarameter and returns true or false depending on whether the regex matches part of the string or not.
You can call these methods on literal regular expressions too. /\d/.test(subject) is a quick way to test whether there are any digits in the subject string.
The String.replace() function interprets several placeholders in the replacement text string. If the regexp contains capturing groups, you can use backreferences in the replacement text. $1 in the replacement text inserts the text matched by the first capturing group, $2 the second, and so on until $99. If your regex has more than 1 but fewer than 10 capturing groups, then $10 is treated as a backreference to the first group followed by a literal zero. If your regex has fewer than 7 capturing groups, then $7 is treated as the literal text $7. $& reinserts the whole regex match. $` (backtick) inserts the text to the left of the regex match, $' (single quote) inserts the text to the right of the regex match. $$ inserts a single dollar sign, as does any $ that does not form one of the placeholders described here.
$_ and $+ are not part of the standard but are supported by some browsers nonetheless. In Internet Explorer, $_ inserts the entire subject string. In Internet Explorer and Firefox, $+ inserts the text matched by the highest-numbered capturing group in the regex. If the highest-numbered group did not participate in the match, $+ is replaced with nothing. This is not the same as $+ in Perl, which inserts the text matched by the highest-numbered capturing group that actually participated in the match.
While things like $& are actually variables in Perl that work anywhere, in JavaScript these only exist as placeholders in the replacement string passed to the replace() function.
I have created an example web page showing JavaScript’s regex support in action. You can try it right now in your web browser. Source code is displayed below the example.
| Quick Start | Tutorial | Tools & Languages | Examples | Reference | Book Reviews |
| grep | PowerGREP | RegexBuddy | RegexMagic |
| EditPad Lite | EditPad Pro |
| Boost | Delphi | GNU (Linux) | Groovy | Java | JavaScript | .NET | PCRE (C/C++) | PCRE2 (C/C++) | Perl | PHP | POSIX | PowerShell | Python | R | Ruby | std::regex | Tcl | VBScript | Visual Basic 6 | wxWidgets | XML Schema | Xojo | XQuery & XPath | XRegExp |
| MySQL | Oracle | PostgreSQL |
Page URL: https://www.regular-expressions.info/javascript.html
Page last updated: 5 November 2021
Site last updated: 06 November 2024
Copyright © 2003-2024 Jan Goyvaerts. All rights reserved.